<!DOCTYPE html>
<html lang="en" ng-app="app">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
    <title>小藏家</title>
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/normalize.css">
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/myStyle.css">
    <script src="js/jquery-1.11.1.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/angular.min.js"></script>
    <script src="js/angular-ui-router.js"></script>
    <script src="js/myJS.js"></script>
</head>
<body>
<div ui-view="">

</div>
<div class="nav">
    <ul>
        <li ui-sref="home">
            <span class="glyphicon glyphicon-home"></span>
            主页
        </li>
        <li ui-sref="class">
            <span class="glyphicon glyphicon-th-list"></span>
            分类
        </li>
        <li ui-sref="me">
            <span class="glyphicon glyphicon-user"></span>
            我
        </li>
    </ul>
</div>
</body>
<script>
    var app = angular.module("app",["ui.router"]);

    app.config(["$stateProvider","$urlRouterProvider",function ($stateProvider,$urlRouterProvider) {
        $urlRouterProvider.when("","/home");
        $urlRouterProvider.when("/home","/home/recommend");
        $urlRouterProvider.when("/me","/me/loveC");
        $stateProvider
            .state("home",{
                url : "/home",
                templateUrl : "html/home.html",
                controller : "homeMsg"
            })
            .state("class",{
                url : "/class",
                templateUrl : "html/class.html",
                controller : "classMsg"
            })
            .state("me",{
                url : "/me",
                templateUrl : "html/me.html",
                controller : "meMsg"
            })
            .state("home.recommend",{
                url : "/recommend",
                templateUrl : "html/recommend.html",
                controller : "recommendMsg"
            })
            .state("home.skill",{
                url : "/skill",
                templateUrl : "html/skill.html",
                controller : "skillMsg"
            })
            .state("me.loveC",{
                url : "/loveC",
                templateUrl : "html/loveC.html"
//                controller : "detailsMsg"
            })
            .state("me.loveGong",{
                url : "/loveGong",
                templateUrl : "html/loveGong.html"
//                controller : "detailsMsg"
            })
    }]);
    
    app.controller("homeMsg",["$scope","$http",function ($scope,$http) {

    }]);

    app.controller("recommendMsg",["$scope","$http",function ($scope,$http) {
        $http.get("json/index.json").then(function (data) {
            $scope.arr = data.data.jingpin;
        })
    }]);

    app.controller("skillMsg",["$scope","$http",function ($scope,$http) {
        $http.get("json/index.json").then(function (data) {
            $scope.arr = data.data.shoucang;
        })
    }]);

    app.controller("classMsg",["$scope","$http",function ($scope,$http) {
        $http.get("json/index.json").then(function (data) {
            $scope.arr = data.data.fenlei;
            $scope.show = function (i) {
                var change = document.getElementsByClassName("changes");
                $(change[i]).next().slideToggle();
                change[i].bool = !change[i].bool;
                if(change[i].bool){
                    $(change[i]).children()[1].setAttribute("class","glyphicon glyphicon-chevron-up");
                    change[i].setAttribute("bool",change[i].boll)
                }else{
                    $(change[i]).children()[1].setAttribute("class","glyphicon glyphicon-chevron-down");
                    change[i].setAttribute("bool",change[i].boll)
                }
            }
        })
    }]);

    app.controller("meMsg",["$scope",function ($scope) {

    }])

</script>
</html>